import {
  observeArr,
  arrMethods
} from './array';
import {
  observe
} from '../observer/index';

function Observer(data) {
  // console.log(data);
  //{name: 'ali', age: 30, info: {…}, hobby: Array(3)}

  //对数组处理 自己的方法
  if (Array.isArray(data)) {
    //更改我数据底下操作array的方法
    data.__proto__ = arrMethods;

    //再包装一下data 增加getter/setter方法
    observeArr(data);

  } else {
    //对对象处理 defineProperty 
    this.walk(data);

  }
}

Observer.prototype.walk = function (data) {
  //拿出所有的key
  var keys = Object.keys(data);
  // console.log(keys);
  // ['name', 'age', 'info', 'hobby']

  for (var i = 0; i < keys.length; i++) {
    var key = keys[i],
      value = data[key];

    // console.log(key); name/age/info/hobby
    // console.log(value); key的值

    //定义响应式数据
    defineReactiveData(data, key, value);
  }
}

//定义响应式数据
//目的：将name/age/info/hobby属性定义getter/setter方法实时监控属性内容
function defineReactiveData(data, key, value) {
  observe(value);

  Object.defineProperty(data, key, {
    get() {
      console.log('响应式数据：获取 ' + value);
      return value;
    },
    set(newValue) {
      console.log('响应式数据：修改 ' + newValue);
      if (newValue === value) return;

      observe(newValue);

      value = newValue;
    }
  })
}

export default Observer;